<!DOCTYPE html>
<html>
      <head>
            {% block meta %}
                  <meta charset="UTF-8">
                  <meta name="viewport" content="width=device-width, initial-scale=1">
            {% endblock %}
            <title>
                  {% block title %}{% endblock %}
            </title>
            {% block stylesheets %}
                  <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@800&family=Open+Sans&display=swap" rel="stylesheet">
                  <link rel='stylesheet' type='text/css' href="{{ asset('assets/css/base.css') }}" media="screen and (min-width: 1300px)">
                  <link rel='stylesheet' type='text/css' href="{{ asset('assets/css/base_mid.css') }}" media="screen and (max-width: 1300px)">
                  <link rel='stylesheet' type='text/css' href="{{ asset('assets/css/base_small.css') }}" media="screen and (max-width: 750px)">
                  <link rel='stylesheet' type='text/css' href="{{ asset('assets/css/reset.css') }}">
            {% endblock %}
      </head>
      <body>
            {% block icons %}
                  <svg aria-hidden="true" style="position: absolute; width: 0; height: 0; overflow: hidden;" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
                        <defs>
                              <symbol id="icon-attach" viewbox="0 0 32 32">
                                    {{ source('@public_path'~asset('assets/icons/attach.svg')) }}
                              </symbol>
                              <symbol id="icon-heart" viewbox="0 0 32 32">
                                    {{ source('@public_path/assets/icons/heart.svg') }}
                              </symbol>
                              <symbol id="icon-logo" viewbox="0 0 32 32">
                                    {{ source('@public_path/assets/icons/logo.svg') }}
                              </symbol>
                              <symbol id="icon-drop" viewbox="0 0 32 32">
                                    {{ source('@public_path/assets/icons/drop.svg') }}
                              </symbol>
                              <symbol id="icon-reply" viewbox="0 0 32 32">
                                    {{ source('@public_path/assets/icons/reply.svg') }}
                              </symbol>
                              <symbol id="icon-menu" viewbox="0 0 32 32">
                                    {{ source('@public_path/assets/icons/menu.svg') }}
                              </symbol>
                              <symbol id="icon-repeat" viewbox="0 0 32 32">
                                    {{ source('@public_path/assets/icons/repeat.svg') }}
                              </symbol>
                              <symbol id="icon-search" viewbox="0 0 32 32">
                                    {{ source('@public_path/assets/icons/search.svg') }}
                              </symbol>
                              <symbol id="icon-avatar" viewbox="0 0 32 32">
                                    {{ source('@public_path/assets/icons/avatar.svg') }}
                              </symbol>
                              <symbol id="icon-checkmark" viewbox="0 0 32 32">
                                    {{ source('@public_path/assets/icons/checkmark.svg') }}
                              </symbol>
                        </defs>
                  </svg>
            {% endblock %}
      <div class="container">
            {% block header %}
                  <div id='header'>
                        <div id='top'>
                              {% block left %}
                              {% endblock left %}
                              <nav id='instance'>
                                    <a href="{{ path('main_public') }}">
                                          <svg class="icon icon-logo">
                                                <use xlink:href="#icon-logo"></use>
                                          </svg>
                                          <b> {{ config('site', 'name') }} </b>
                                    </a>
                              </nav>
                              <div id="right-panel">
                                    <input type="checkbox" id="toggle-right" class="larger">
                                    <div class="arrow right">
                                          <label for="toggle-right" id='right-panel'></label>
                                    </div>
                                    <div class='rss'>
                                          <div>
                                          </div>
                                    </div>
                              </div>
                        </div>
                  </div>
            {% endblock header%}

            {% block nav %}{% endblock %}
            {% block body %}{% endblock %}
            {% block javascripts %}{% endblock javascripts%}
      </div>
      </body>
</html>
